<template>
<div class="data_new_box appCon t-center page_pos_style" :style="{ top: `${phoneStatusBarHeight}`}" style="padding:unset;">
  
  <!-- 顶部盒子 -->
    <!-- <van-nav-bar :title="key == 'name' ? '用户名' : '备注'" fixed placeholder :border="false"> -->
      <!-- 顶部返回按钮 -->
      <!-- <template #left>
        <van-icon name="arrow-left" size="18" @click="$router.go(-1);" />
      </template>
    </van-nav-bar> -->
    
    <navbar :title="title"></navbar>
  <!-- this is find indexpage -->
  <van-field
    v-model="content"
    rows="2"
	class="marBtm"
    autosize
    type="textarea"
    :maxlength="maxlengthType"
    placeholder="请输入内容"
    show-word-limit
  />
  <!-- <van-button type="primary" class=" coll_80" size="small"  @click="save">保存</van-button>	 -->
  <div class="but">
    <van-button block type="primary" style="color:#ffffff !important;font-size:16px !important;" @click="save">保存</van-button>
  </div>
</div>

</template>

<script>
import { Toast } from 'vant'
import {getUserInfoMyUpdateMyInfoC,getUpdataRemark,getUserAppCheckName} from './api'
export default { 
	name:'SetInfo',
	data(){
		return {
      // header栏 => 标题
      title:"",

			content:'',
      // 类型判断值
      key:'',
      // 获取屏幕状态栏高度
      phoneStatusBarHeight:'',
      // 限制输入框长度
      maxlengthType:'50'
		}
	},
	methods:{
    // 校验用户名是否重复
    async initUserAppCheckName(value){
      const data = await getUserAppCheckName(value)
      if (data.code !== 0 ) return Toast(data.msg)
      let params = {
        newName:this.content,
        type:'01'
      }
      this.initUserInfoMyUpdateMyInfoC(params)
    },
    // 保存用户名
    async initUserInfoMyUpdateMyInfoC(params){
      const {data} = await getUserInfoMyUpdateMyInfoC(params)
      
      this.$router.go(-1)
    },
    // 保存用户名
    async initUpdataRemark(params){
      const data = await getUpdataRemark(params)
      if (data.code !== 0) return Toast(data.msg)

      this.$router.go(-1)
    },
		save(){
      if (this.key == 'name') {
        let value = {
          data: true,
          name:this.content
        }
        this.initUserAppCheckName(value)
      }else if (this.key == 'remark') {
        let params = {
          remark:this.content,
        }
        this.initUpdataRemark(params)
      }
		}
	},
  created() {
    // 获取屏幕状态栏高度
    this.phoneStatusBarHeight = window.phoneStatusBarHeight
    this.key = this.$route.query.ty
    this.title = this.$route.query.ty == 'name' ? '用户名' : "备注"
    document.title = this.$route.query.ty == 'name' ? '用户名' : "备注"
    this.maxlengthType = this.$route.query.ty == 'name' ? '50' : "200"
    if (this.key == 'name') {
      this.content = this.$route.query.name
    }
    if (this.key == 'remark') {
      this.content = this.$route.query.remark
    }
  },
}
</script>

<style lang="less">
.data_new_box{
  .van-cell{
    .van-cell__title {
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      // height: 100px;
      width: 100%;
    }
    .van-cell__value {
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      // height: 100px;
      width: 100%;
    }
    .van-icon{
      font-size: 18px;
    }
  }
  .but{
    margin: 20px 12px;
    .van-button{
      color: black !important;
      font-size: 17px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #333333;
    }
  }
}
</style>